<template>
    <div>

        <!-- 头部插槽 -->
        <Head>
            
        </Head>
        <!-- 轮播 -->
        <MySwiper></MySwiper>

        <!-- 图标导航 -->
        <IconList></IconList>

        <!-- 热门推荐歌单 -->
        <RecommendMusic :recommendMusic="recommendMusic">
            <template v-slot:left>
                <span class="tit">推荐歌单</span>
            </template>
            <template v-slot:right>
                <span class="rig">更多</span>
            </template>
        </RecommendMusic>


    </div>
</template>

<script>
import Head from 'components/myhead/myhead.vue'
import MySwiper from "components/swiper/swiper.vue"
import IconList from "components/iconlist/iconlist.vue"
import RecommendMusic from "components/recommendmusic/recommendmusic.vue"


import { getRecomList ,getRecList } from "api/tabbar/index";
import { numberFormat }  from 'utils/numformat'


export default {
    name:'find',
    components:{
        Head,
        MySwiper,
        IconList,
        RecommendMusic
    },
    data() {
        return {
            // 推荐歌单
            recommendMusic: [],
            // 雷达歌单
        };
    },
    created() {
        this.getRecomLists();
    },
    methods: {
        // 获取推荐歌单
        getRecomLists(){
            getRecList().then(res => {
                console.log(res)
                res.result.forEach(element => {
                    element.playCount = numberFormat(element.playCount)
                });
                this.recommendMusic = res.result
            })
        },
    },
};
</script>

<style scoped lang="scss">


</style>
